Skip to content
This repository is currently being migrated. It's locked while the migration is in progress.

Divider: Add accessibility notes to divider - #6153

Merged
babsdenney merged 8 commits into
mainfrom
6101
Apr 23, 2026
Merged

Divider: Add accessibility notes to divider#6153
babsdenney merged 8 commits into
mainfrom
6101

Conversation

@babsdenney

@babsdenney babsdenney commented Apr 21, 2026

Copy link
Copy Markdown
Contributor

Summary

Update divider component doc: add web-component: va-divider and anchors (Example, Usage, Accessibility considerations) in frontmatter; append an Accessibility considerations section that explains decorative vs semantic dividers and when to use aria-hidden="true", with example markup for va-divider.

Just a note about dividers - We have an issue to add the plain divider that we should work on in the future.

#1785

Related Issue

Closes #6101

Preview Environment Links

Open Preview Environment

Update divider component doc: add `web-component: va-divider` and anchors (Example, Usage, Accessibility considerations) in frontmatter; append an Accessibility considerations section that explains decorative vs semantic dividers and when to use `aria-hidden="true"`, with example markup for `va-divider`.
@babsdenney babsdenney self-assigned this Apr 21, 2026
Copilot AI review requested due to automatic review settings April 21, 2026 16:27

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Updates the Divider component documentation to better support accessibility guidance and improve page metadata for the documentation site.

Changes:

  • Adds web-component: va-divider and an anchors list in the page front matter.
  • Adds an “Accessibility considerations” section explaining decorative vs. semantic dividers and when to use aria-hidden="true".

Comment thread src/_components/divider.md
Comment thread src/_components/divider.md Outdated
Comment thread src/_components/divider.md
Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
Delete the 'web-component: va-divider' frontmatter line in src/_components/divider.md to clean up component metadata for the Divider documentation.
@babsdenney
babsdenney marked this pull request as ready for review April 21, 2026 17:51
@babsdenney
babsdenney requested a review from a team as a code owner April 21, 2026 17:51
Comment thread src/_components/divider.md Outdated
- Content structure is already clear through headings or other markup

```html
<va-divider aria-hidden="true"></va-divider>

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@babsdenney - check this - I think the divider is still just html with classes, and not an actual va-component.

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Oh, you are right! I totally trusted the copilot too much on that one. Thank you for finding that. I removed the HTML examples since those aren't really necessary.

Removed examples of HTML for aria-hidden attribute usage.

@jeana-adhoc jeana-adhoc left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM!

@babsdenney
babsdenney merged commit aa1c638 into main Apr 23, 2026
5 checks passed
@babsdenney
babsdenney deleted the 6101 branch April 23, 2026 15:30
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Add guidance around when an hr is decorative or not and how to handle it

4 participants